<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <title>生意帮</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/common.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui-pull-refresh.css" />
    <link rel="stylesheet" type="text/css" href="../../css/swiper.min.css">
    <link rel="stylesheet" type="text/css" href="../../css/aui-slide.css" />
    <style>
        html,
        body {
            background-color: transparent;
        }

        .boxB {
            position: relative;
            ;
            width: 100%;
            height: 100vh;
        }

        .mask {
            position: absolute;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.3);
        }

        .box {
            background-color: #fff;
            position: absolute;
            left: 0;
            bottom: 0;
            width: 100%;
        }

        .aui-content {}

        .head_right .aui-pull-right {
            border: 1px solid #999;
            border-radius: 50%;
            height: 1rem;
            width: 1rem;
            text-align: center;
            line-height: 1rem;
        }

        .aui-iconfont {
            font-size: 0.6rem;
            vertical-align: top;
        }

        .head_right {
            position: relative;
        }

        .clearfix:after {
            content: '';
            display: block;
            clear: both;
        }

        #app .aui-list-header {
            background: #fff;
        }

        .aui-list-header i {
            font-style: normal;
            font-size: 1rem;
        }

        .Submit {
            background: url(../../image/header_bg.png) no-repeat center !important;
            font-size: 0.8rem;
            color: #fff;
            text-align: center;
            padding: 0.5rem 0
        }
    </style>
</head>

<body>
    <div id="app">
        <div class="boxB">
            <div class="mask" onclick="close_this_frm()"></div>
            <div class="box">
                <div class="aui-content">
                    <ul class="aui-list aui-media-list">
                        <li class="aui-list-header">
                            请选择支付方式 <i onclick="close_this_frm()">×</i>
                        </li>
                        <li class="aui-list-item aui-list-item-middle" @click="pay(2)">
                            <div class="aui-media-list-item-inner">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../../image/my/m42.png" class="aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    <div class="aui-list-item-text">
                                        <div class="aui-list-item-title aui-font-size-14">支付宝支付</div>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li class="aui-list-item aui-list-item-middle" @click="pay(3)">
                            <div class="aui-media-list-item-inner">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../../image/my/m41.png" class="aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    <div class="aui-list-item-text">
                                        <div class="aui-list-item-title aui-font-size-14">微信支付</div>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li class="aui-list-item aui-list-item-middle" @click="pay(1)">
                            <div class="aui-media-list-item-inner">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../../image/my/m40.png" class="aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    <div class="aui-list-item-text">
                                        <div class="aui-list-item-title aui-font-size-14">银联支付</div>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li class="aui-list-item aui-list-item-middle" @click="pay(4)">
                            <div class="aui-media-list-item-inner">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../../image/my/m43.png" class="aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    <div class="aui-list-item-text">
                                        <div class="aui-list-item-title aui-font-size-14">余额支付</div>
                                    </div>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/zepto.js"></script>
<script type="text/javascript" src="../../script/vue.min.js"></script>
<script type="text/javascript" src="../../script/utils.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript" src="../../script/aui-tab.js"></script>
<script type="text/javascript" src="../../script/aui-scroll.js"></script>
<script type="text/javascript" src="../../script/aui-pull-refresh.js"></script>
<script type="text/javascript" src="../../script/swiper.min.js"></script>
<script type="text/javascript" src="../../script/aui-slide.js"></script>
<script type="text/javascript" src="../../script/aui-lazyload.js"></script>
<script type="text/javascript" src="../../script/aui-dialog.js"></script>
<script type="text/javascript">
    apiready = function() {
        var app = new Vue({
            el: '#app',
            data: {},
            created: function() {
                var $_this = this;

            },
            methods: {

                // 选择支付类型
                pay: function(type) {
                    var $_this = this;
                    if (type == 2) {
                        console.log('支付宝');
                        $_this.input_ok(type);
                    } else if (type == 3) {
                        console.log('微信支付');
                        $_this.input_ok(type);
                    } else if (type == 1) {
                        console.log('银行卡支付');
                        $_this.input_ok(type);
                    } else if (type == 4) {
                        console.log('余额支付');
                        $_this.input_ok(type);
                    }
                },
                // 输入金额确认支付
                input_ok: function(type) {


                    var $_this = this;


                    var dialog = new auiDialog({})

                    dialog.prompt({
                        title: "请填写支付金额",
                        text: '',
                        buttons: ['取消', '确定']
                    }, function(ret) {
                        if (ret.buttonIndex == 2) {

                          if(ret.text==''){
                            api.toast({
                                msg: '请填写金额',
                                duration: 2000,
                                location: 'bottom'
                            });
                            return;
                          }

                            if (type == 1 || type == 2 || type == 3) {
                                api.showProgress({
                                    style: 'default',
                                    animationType: 'fade',
                                    title: '努力支付中...',
                                    text: '先喝杯茶...',
                                    modal: false
                                });

                                api.ajax({
                                    url: window.Url.Freesuper_superPay,
                                    method: 'post',
                                    data: {
                                        values: {
                                            token: $api.getStorage('token'),
                                            type: type,
                                            super: api.pageParam.super,
                                            price: ret.text,
                                            password: ''
                                        }
                                    }
                                }, function(ret, err) {
                                    api.hideProgress();
                                    if (ret) {
                                        console.log("线下支付接口调用成功---" + JSON.stringify(ret));

                                        //银行卡支付
                                        if (type == 1) {
                                            api.toast({
                                                msg: '暂未开通，请重新选择',
                                                duration: 2000,
                                                location: 'bottom'
                                            });
                                        }

                                        //支付宝接口
                                        else if (type == 2) {
                                            if (ret.re == 1) {
                                                $_this.zfb_pay(ret.data.pay_info);
                                            } else {
                                                api.toast({
                                                    msg: ret.info,
                                                    duration: 2000,
                                                    location: 'bottom'
                                                });
                                            }
                                        }

                                        // 微信接口
                                        else if (type == 3) {
                                            if (ret.re == 1) {
                                                $_this.wx_pay(ret.data.pay_info);
                                            } else {
                                                api.toast({
                                                    msg: ret.info,
                                                    duration: 2000,
                                                    location: 'bottom'
                                                });
                                            }
                                        }
                                    } else {
                                        console.log("线下支付接口调用失败---" + JSON.stringify(err));
                                    }
                                });
                            } else {
                                api.openFrame({
                                    name: 'pay_password5',
                                    url: '../five_frame/pay_password5.html',
                                    pageParam: {
                                        super: api.pageParam.super,
                                        text: ret.text
                                    }
                                });


                                // api.ajax({
                                //     url: window.Url.Freesuper_superPay,
                                //     method: 'post',
                                //     data: {
                                //         values: {
                                //             token: $api.getStorage('token'),
                                //             type: type,
                                //             super: api.pageParam.super,
                                //             price: ret.text,
                                //             // password:
                                //         }
                                //     }
                                // }, function(ret, err) {
                                //     if (ret) {
                                //         alert(JSON.stringify(ret));
                                //     } else {
                                //         alert(JSON.stringify(err));
                                //     }
                                // });



                            }

                        }
                    })

                },
                // 调用对应支付
                wx_pay: function(pay_info) {
                    var weiXin = api.require('weiXin');
                    weiXin.payOrder({
                        orderId: pay_info.prepayid,
                        partnerId: pay_info.partnerid,
                        nonceStr: pay_info.noncestr,
                        timeStamp: pay_info.timestamp,
                        package: pay_info.package,
                        sign: pay_info.sign
                    }, function(re, er) {
                        console.log('调用微信支付ret----' + JSON.stringify(re));
                        console.log('调用微信支付err----' + JSON.stringify(er));
                        if (re.status) {

                        }
                    })
                },
                // 调用支付宝支付
                zfb_pay: function(pay_info) {
                    var aliPay = api.require('aliPay');
                    aliPay.payOrder({
                        orderInfo: pay_info
                    }, function(ret, err) {
                        switch (ret.code) {
                            case '9000':
                                api.toast({
                                    msg: '支付成功',
                                    duration: 2000,
                                    location: 'middle'
                                });
                                close_this_frm()
                                break;
                            case '4000':
                                api.toast({
                                    msg: '系统异常',
                                    duration: 2000,
                                    location: 'middle'
                                });
                                break;
                            case '4001':
                                api.toast({
                                    msg: '数据格式不正确',
                                    duration: 2000,
                                    location: 'middle'
                                });
                                break;
                            case '4003':
                                api.toast({
                                    msg: '该用户绑定的支付宝账户被冻结或不允许支付',
                                    duration: 2000,
                                    location: 'middle'
                                });
                                break;
                            case '4004':
                                api.toast({
                                    msg: '该用户已解除绑定',
                                    duration: 2000,
                                    location: 'middle'
                                });
                                break;
                            case '4005':
                                api.toast({
                                    msg: '绑定失败或没有绑定',
                                    duration: 2000,
                                    location: 'middle'
                                });
                                break;
                            case '4006':
                                api.toast({
                                    msg: '订单支付失败',
                                    duration: 2000,
                                    location: 'middle'
                                });
                                break;
                            case '4010':
                                api.toast({
                                    msg: '重新绑定账户',
                                    duration: 2000,
                                    location: 'middle'
                                });
                                break;
                            case '6000':
                                api.toast({
                                    msg: '支付服务正在进行升级操作',
                                    duration: 2000,
                                    location: 'middle'
                                });
                                break;
                            case '6001':
                                api.toast({
                                    msg: '用户中途取消支付操作',
                                    duration: 2000,
                                    location: 'middle'
                                });
                                break;
                            default:
                                api.toast({
                                    msg: ret.code,
                                    duration: 2000,
                                    location: 'middle'
                                });
                        }
                    });
                }

            },
            mounted: function() {}
        })
    }


    // 关闭当前的frm
    function close_this_frm() {
        api.closeFrame({
            animation: {
                type: "none",
                duration: 0,
            }
        });
    }
</script>

</html>
